<template>

  <section class="app-inner">
    <el-dialog
      :title="addSchoolForm.title"
      :visible.sync="addSchoolForm.flag"
      width="70%"
      modal
      center
      top="8vh"
      style="z-index: 44!important"
      :modal-append-to-body="false"
      :before-close="close">
      <div style="position: relative;">
        <el-tabs v-model="activeName">
          <el-tab-pane label="基本信息" name="1">
            <el-form ref="form" :model="infoForm" label-width="140px" :rules="rules" size="small" class="info-school-tab">
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="学校名称" prop="name" class="line">
                    <el-input v-model="infoForm.name"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="学校英文名称" prop="enName" class="line">
                    <el-input v-model="infoForm.enName"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="学校编码" prop="unicode" class="line">
                    <el-input v-model="infoForm.unicode"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
              <!-- </el-row> -->
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="邮政编码" prop="postCode" class="line">
                    <el-input v-model="infoForm.postCode"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="学校地址" prop="address" class="line">
                    <el-input v-model="infoForm.address"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="行政区" prop="administrativeCode" class="line">
                    <el-select v-model="infoForm.administrativeCode">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['行政区']"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
              <!-- </el-row> -->
              <!-- <el-row :gutter="20"> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="学校经纬度" prop="longitudeLatitude" class="line">
                    <el-input v-model="infoForm.longitudeLatitude"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="所在地城乡类型" prop="areaCode" class="line">
                    <el-select v-model="infoForm.areaCode">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['城乡类型']"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="是否有分校区" prop="isDistrict" class="line">
                    <el-select v-model="infoForm.isDistrict">
                      <el-option
                        style="width: 100%"
                        v-for="item in yn"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
              <!-- </el-row> -->
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="学校办学类型" prop="type" class="line">
                    <el-select v-model="infoForm.type">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['办学类']"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="联系人" prop="contact" class="line">
                    <el-input v-model="infoForm.contact"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="学校办别类型" prop="schTypeNo" class="line">
                    <el-select v-model="infoForm.schTypeNo">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['学校办别代码']"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
              <!-- </el-row> -->
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="联系方式" prop="contactWay" class="line">
                    <Acc-desensitization ref="cellularPhone" rule-type='cellularPhone' v-model="infoForm.contactWay"></Acc-desensitization>
                  </el-form-item>
                <!-- </el-col>
                <el-col :span="8"> -->
                  <el-form-item label="学校举办部门" prop="organizerCode" class="line">
                    <el-select v-model="infoForm.organizerCode">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['举办者']"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="建校年月" prop="schoolYear" class="line">
                    <el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 100%"
                                    v-model="infoForm.schoolYear" type="date" size="small"></el-date-picker>
                  </el-form-item>
                <!-- </el-col> -->
              <!-- </el-row> -->
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="学校属地主管部门" prop="eduDeptNo" class="line">
                    <el-select v-model="infoForm.eduDeptNo">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['行政区']"
                        :key="item.code"
                        :label="item.name+'教育局'"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="校庆日" prop="decorationDay" class="line">
                    <el-date-picker format="MM-dd" value-format="MM-dd" style="width: 100%"
                                    v-model="infoForm.decorationDay" type="date" size="small"></el-date-picker>
                  </el-form-item>
                <!-- </el-col>
                <el-col :span="8"> -->
                  <el-form-item label="学校所属主管部门" prop="eduMasterNo" class="line">
                      <el-select v-model="infoForm.eduMasterNo">
                      <el-option
                        style="width: 100%"
                        v-for="item in comData['行政区']"
                        :key="item.code"
                        :label="item.name+'教育局'"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                <!-- </el-col>
              </el-row> -->
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="学校法人" prop="legalPerson" class="line">
                    <el-input v-model="infoForm.legalPerson"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="传真电话" prop="faxPhone" class="line">
                    <el-input v-model="infoForm.faxPhone"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="法人证件号" prop="registerAccount" class="line">
                    <Acc-desensitization ref="AccDesensitization" v-model="infoForm.registerAccount"></Acc-desensitization>
                  </el-form-item>
                <!-- </el-col>
              </el-row> -->
              <!-- <el-row :gutter="20">
                <el-col :span="8"> -->
                  <el-form-item label="电子邮箱" prop="email" class="line">
                    <el-input v-model="infoForm.email"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="法人工号" prop="legalPersonNo" class="line">
                    <el-input v-model="infoForm.legalPersonNo"></el-input>
                  </el-form-item>
                <!-- </el-col> -->
                <!-- <el-col :span="8"> -->
                  <el-form-item label="官网主页" prop="website" class="line">
                    <el-input v-model="infoForm.website"></el-input>
                  </el-form-item>
                <!-- </el-col>
              </el-row> -->
                  <el-form-item label="党委负责人" prop="partyLeader" class="line">
                    <el-input v-model="infoForm.partyLeader"></el-input>
                  </el-form-item>
            </el-form>
          </el-tab-pane>
          <el-tab-pane label="校史发展" name="2" class="school-history-development">
            <section class="box" style="padding-top:20px">
              <div class="title">校史发展介绍</div>
              <editor class="content" v-model="infoForm.schoolHistory" ref="editorEl" :isClear="isClear"/>
            </section>
            <section class="box2">
              <div class="title">校史图片</div>
                <section class="avatar-box">
                <draggable v-model="infoForm.historyList">
                  <el-avatar v-for="(item,index) in infoForm.historyList" :key="index" shape="square" :size="150" fit="fill" class="avatar sr" style="position:relative">
                    <div class="hver">
                      <i class="el-icon-delete" style="position:absolute;left:calc(50% - 10px);top:calc(50% - 10px);font-size:20px" @click="historyPicD(index)"></i>
                    </div>
                    <img :src="`/gateway/api/basic/minio/getFileSource?fileName=${item}`" class="fimg">
                  </el-avatar>
                </draggable>
              <el-upload
                action=""
                class="avatar"
                list-type="picture-card"
                :show-file-list="false"
                :http-request="historyPic"
                :before-upload="beforeAvatarUpload">
                <i class="el-icon-plus"></i>
              </el-upload>
              <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="dialogImageUrl" alt="">
              </el-dialog>
              </section>
            </section>
          </el-tab-pane>
          <el-tab-pane label="学校荣誉" name="3" class="school-honors">
            <section >
              <el-card>
                <el-button  type="primary" @click="addSchoolHonor">新增学校荣誉</el-button>
                <el-button  type="primary" @click="openImportHonor">批量新增学校荣誉</el-button>
              </el-card>

              <el-card v-for="(item, index) in infoForm.sepSchoolHonorInfoList" :key="index">
                <el-row class="box">
                  <div class="title">学校荣誉名称</div>
                  <el-input size="small" v-model="infoForm.sepSchoolHonorInfoList[index].honorName" class="content-input"></el-input>
                </el-row>
                <el-row class="box">
                  <div class="title">荣誉获得时间</div>
                  <el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="content-input"
                                  v-model="infoForm.sepSchoolHonorInfoList[index].awardTime" type="date" size="small"></el-date-picker>
                </el-row>
                <el-row class="box">
                  <div class="title">荣誉获得等级</div>
                  <el-select v-model="infoForm.sepSchoolHonorInfoList[index].level" size="small" class="content-input">
                    <el-option
                      v-for="data in honorLevels"
                      :key="data.code"
                      :label="data.message"
                      :value="data.code">
                    </el-option>
                  </el-select>
                </el-row>
                <el-row class="box">
                  <div class="title">荣誉照片</div>
                  <section class="avatar-box">
              <draggable v-model="infoForm.sepSchoolHonorInfoList[index].honorList">
                  <el-avatar v-for="(item1,index1) in infoForm.sepSchoolHonorInfoList[index].honorList" :key="index1" shape="square" :size="150" fit="fill" class="avatar sr" style="position:relative">
                    <div class="hver">
                      <i class="el-icon-delete" style="position:absolute;left:calc(50% - 10px);top:calc(50% - 10px);font-size:20px" @click="honorPicD(index1,index)"></i>
                    </div>
                    <img :src="`/gateway/api/basic/minio/getFileSource?fileName=${item1}`" class="fimg">
                  </el-avatar>
              </draggable>
                    <el-upload
                      action=""
                      class="avatar"
                      :show-file-list="false"
                      :http-request="(params) =>honorPic(params,index)"
                      :before-upload="beforeAvatarUpload"
                      list-type="picture-card">
                      <i class="el-icon-plus"></i>
                    </el-upload>
                    <el-dialog :visible.sync="dialogVisible">
                      <img width="100%" :src="dialogImageUrl" alt="">
                    </el-dialog>
                  </section>
                </el-row>
                <el-row class="box">
                  <i class="el-icon-delete" style="font-size: 20px; float:right;" @click="delHonor(item.no)"></i>
                </el-row>
              </el-card>
            </section>
            <div v-if="infoForm.sepSchoolHonorInfoList.length<1">
              暂无数据
            </div>
          </el-tab-pane>
          <el-tab-pane label="教学理念" name="4" class="teaching-concept">
            <section class="box" style="padding-top:20px">
              <div class="title">教学理念介绍</div>
              <editor class="content" v-model="infoForm.concept" ref="conceptEl" :isClear="isClear"/>
            </section>
            <section class="box2">
              <div class="title">教学理念图片</div>
              <div class="avatar-box">
              <draggable v-model="infoForm.conceptPicList">
                  <el-avatar v-for="(item,index) in infoForm.conceptPicList" :key="index" shape="square" :size="150" fit="fill" class="avatar sr" style="position:relative">
                    <div class="hver">
                      <i class="el-icon-delete" style="position:absolute;left:calc(50% - 10px);top:calc(50% - 10px);font-size:20px" @click="conceptPicD(index)"></i>
                    </div>
                    <img :src="`/gateway/api/basic/minio/getFileSource?fileName=${item}`" class="fimg">
                  </el-avatar>
              </draggable>
              <el-upload
                action=""
                class="avatar"
                :on-remove="handleRemove"
                list-type="picture-card"
                :show-file-list="false"
                :before-upload="beforeAvatarUpload"
                :http-request="conceptPic">
                <i class="el-icon-plus"></i>
              </el-upload>
              <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="dialogImageUrl" alt="">
              </el-dialog>
              </div>
            </section>
          </el-tab-pane>
          <el-tab-pane label="校园特色场景" name="5" class="campus-characteristic-scene">
            <div>
              <el-card>
                <el-button  type="primary" @click="addSchoolScene">新增校园特色场景</el-button>
              </el-card>
              <el-card v-for="(item, index) in infoForm.sepSchoolSceneInfoList" :key="index">
                <section class="box">
                  <div class="title" >场景名称</div>
                  <el-input class="content" size="small" v-model="infoForm.sepSchoolSceneInfoList[index].sceneName"></el-input>
                </section>
                <section class="box">
                  <div class="title">场景介绍</div>
                  <editor class="content" v-model="infoForm.sepSchoolSceneInfoList[index].description" ref="SceneEL" :isClear="infoForm.sepSchoolSceneInfoList[index].description?true:false"/>
                </section>
                <section class="box">
                  <div class="title">场景图片</div>
                  <draggable v-model="infoForm.sepSchoolSceneInfoList[index].imageUrlList">
                  <el-avatar v-for="(item1,index1) in infoForm.sepSchoolSceneInfoList[index].imageUrlList" :key="index1" shape="square" :size="150" fit="fill" class="avatar sr" style="position:relative">
                    <div class="hver">
                      <i class="el-icon-delete" style="position:absolute;left:calc(50% - 10px);top:calc(50% - 10px);font-size:20px" @click="scenePicD(index1,index)"></i>
                    </div>
                    <img :src="`/gateway/api/basic/minio/getFileSource?fileName=${item1}`" class="fimg">
                  </el-avatar>
                  </draggable>
                  <el-upload
                    style="margin-left: 10px"
                    action=""
                    class="content"
                    list-type="picture-card"
                    :show-file-list="false"
                    :before-upload="beforeAvatarUpload"
                    :http-request="(params) =>scenePic(params,index)">
                    <i class="el-icon-plus"></i>
                  </el-upload>
                  <el-dialog :visible.sync="dialogVisible">
                    <img width="100%" :src="dialogImageUrl" alt="">
                  </el-dialog>
                </section>
                <section class="box" style="display: block;padding: 10px;">
                  <i class="el-icon-delete" style="font-size: 20px; float:right!important;" @click="delSence(item.no)"></i>
                </section>
              </el-card>
            </div>
            <div v-if="infoForm.sepSchoolSceneInfoList.length<1">暂无数据</div>
          </el-tab-pane>
          <el-tab-pane label="人员概览" name="6" class="peopleInfo">
            <el-descriptions :column="1">
              <el-descriptions-item :label="item.name" v-for="(item, index) in infoForm.personnelRespList" :key="index">
                <!-- {{ item.code || '--'}} -->
                <el-input class="person" size="small" v-model="item.code" style="width:80%"></el-input>
                <div style="display:inline">{{item.name==='班级数量'?'个':'人'}}</div>
                </el-descriptions-item>
            </el-descriptions>
            <el-button  class="reData" type="primary" @click="synPersonnelDataMethod()" size="small">同步数据</el-button>
          </el-tab-pane>
        </el-tabs>
        <div class="switch-btn cursor iconfont" :class="[isShow ? 'icon-yanjing': 'icon-biyan']" @click="handleClickIsShow"></div>
       </div>
      <div class="foot">
        <el-button  type="primary" @click.native.prevent="close()">取消</el-button>
        <el-button  type="primary" @click.native.prevent="sub()">保存</el-button>
      </div>
      <el-dialog
        width="40%"
        title="批量上传学校荣誉"
        :visible.sync="isImportHonor"
        append-to-body
        center
      >
        <div :style="{ paddingBottom: '25px' }">
          <el-upload
            style="margin-bottom: 30px"
            :show-file-list="false"
            action="/gateway/api/basic/school/batchImport"
            :headers="headerObj"
            :on-success="handlefileSuccess"
            :before-upload="beforeUpload"
          >
            <el-button type="primary">上传文件</el-button>
          </el-upload>
          <div class="import-honor-des">
            <div class="title">导入说明</div>
            <div class="box1">
              <span
                >1.
                导入的文件格式为Excel或压缩包格式，后缀名为.xls或.xlsx或zip；</span
              >
              <el-button type="text" class="btn" @click="getSchoolHonorTemp"
                >点击下载模板文件</el-button
              >
            </div>
            <p class="text">2. 导入的文件应该放在文件的第一个工作表中；</p>
            <p class="text">3. 请勿修改您下载模板的标题（前三行）；</p>
            <p class="text">4. 请务必填写表格中必填信息；</p>
          </div>
        </div>
        <div
          class="foot"
          :style="{ display: 'flex', justifyContent: 'center' }"
        >
          <el-button type="primary" @click.native.prevent="closeImportHonor"
            >取消</el-button
          >
        </div>
      </el-dialog>
    </el-dialog>
  </section>

</template>

<script>
import { encrypt, decrypt } from '@/utils/crypto'
import draggable from 'vuedraggable'
import editor from './editor'
import CryptoJS from 'crypto-js'
import { updateSepSchool, deleteHonor, getHonor, upload, deleteScene, synPersonnelData, getSepSchool, downloadTemplateHonor, importSchoolHonor } from '@/views/children/basic/js/schoolInfo'
import { sepDataDicInfoQuery } from '@/views/children/basic/js/controllerInfo'
const CRYPTOJSKEY = 'nHwsk9MvRJhc5wRN'
export default {
  name: 'addSchoolInfo',
  components: {
    editor,
    draggable
  },
  props: {
    addSchoolForm: {
      type: Object
    },
    data: {
      type: Object
    }
  },
  data () {
    return {
      isShow: true,
      headerObj: {
        Authorization: window.sessionStorage.getItem('token')
      },
      activeName: '1',
      // 基础表单校验规则
      rules: {
        name: [{ required: true, validator: this.validateName }],
        unicode: [{ required: true, validator: this.validateUnicode }],
        postCode: [{ required: true, validator: this.validatePostCode }],
        address: [{ required: true, validator: this.validateAddress }],
        administrativeCode: [{ required: true, validator: this.validateAdministrativeCode }],
        areaCode: [{ required: true, validator: this.validateAreaCode }],
        contact: [{ required: true, validator: this.validateContact }],
        type: [{ required: true, validator: this.validateType }],
        contactWay: [{ required: true, validator: this.validateContactWay }],
        schTypeNo: [{ required: true, validator: this.validateSchTypeNo }],
        schoolYear: [{ required: true, validator: this.validateSchoolYear }],
        organizerCode: [{ required: true, validator: this.validateOrganizerCode }],
        decorationDay: [{ required: true, validator: this.validateDecorationDay }],
        eduDeptNo: [{ required: true, validator: this.validateEduDeptNo }],
        eduMasterNo: [{ required: true, validator: this.validateEduMasterNo }],
        faxPhone: [{ required: false, validator: this.validateFaxPhone }],
        email: [{ required: false, validator: this.validateEmail }],
        website: [{ required: false, validator: this.validateWebsite }],
        isDistrict: [{ required: true, validator: this.validateIsDistrict }]
      },
      content: '',
      isClear: false,
      dialogImageUrl: '',
      dialogVisible: false,
      honorLevels: [],
      // 表单信息默认数据
      infoForm: {
        sepSchoolHonorInfoList: [],
        sepSchoolSceneInfoList: []
      },
      comData: {},
      yn: [{ code: 1, name: '是' }, { code: 0, name: '否' }],
      isImportHonor: false
    }
  },
  watch: {
    data: {
      deep: true,
      handler (newVal, oldVal) {
        this.infoForm = newVal
      }
    },
    'addSchoolForm.flag': {
      handler (newVal, oldVal) {
        // this.infoForm = newVal
        if (!newVal) {
          this.activeName = '1'
        }
      }
    }
  },
  methods: {
    handleClickIsShow () {
      this.isShow = !this.isShow
      this.$refs.AccDesensitization.doShow()
      this.$refs.cellularPhone.doShow()
    },
    // 校史图片删除
    historyPicD (index) {
      this.infoForm.historyList.splice(index, 1)
      this.infoForm.historyPic = this.infoForm.historyPic.split(',')
      this.infoForm.historyPic.splice(index, 1)
      this.infoForm.historyPic = this.infoForm.historyPic.join()
    },
    conceptPicD (index) {
      this.infoForm.conceptPicList.splice(index, 1)
      this.infoForm.conceptPic = this.infoForm.conceptPic.split(',')
      this.infoForm.conceptPic.splice(index, 1)
      this.infoForm.conceptPic = this.infoForm.conceptPic.join()
    },
    honorPicD (index1, index) {
      this.infoForm.sepSchoolHonorInfoList[index].honorList.splice(index1, 1)
      this.infoForm.sepSchoolHonorInfoList[index].awardPic = this.infoForm.sepSchoolHonorInfoList[index].awardPic.split(',')
      this.infoForm.sepSchoolHonorInfoList[index].awardPic.splice(index1, 1)
      this.infoForm.sepSchoolHonorInfoList[index].awardPic = this.infoForm.sepSchoolHonorInfoList[index].awardPic.join()
    },
    scenePicD (index1, index) {
      this.infoForm.sepSchoolSceneInfoList[index].imageUrlList.splice(index1, 1)
      this.infoForm.sepSchoolSceneInfoList[index].imageUrl = this.infoForm.sepSchoolSceneInfoList[index].imageUrl.split(',')
      this.infoForm.sepSchoolSceneInfoList[index].imageUrl.splice(index1, 1)
      this.infoForm.sepSchoolSceneInfoList[index].imageUrl = this.infoForm.sepSchoolSceneInfoList[index].imageUrl.join()
    },
    // 荣誉上传图片
    honorPic (file, index) {
      let headFile = file.file
      let formData = new FormData()
      formData.append('file', headFile)
      let self = this
      upload(formData).then((res) => {
        self.$message.success('上传成功')
        if (!self.infoForm.sepSchoolHonorInfoList[index].honorList) {
          self.infoForm.sepSchoolHonorInfoList[index].honorList = []
        }
        self.infoForm.sepSchoolHonorInfoList[index].honorList.push(res.data)
        if (self.infoForm.sepSchoolHonorInfoList[index].awardPic) {
          self.infoForm.sepSchoolHonorInfoList[index].awardPic = self.infoForm.sepSchoolHonorInfoList[index].awardPic.split(',')
          self.infoForm.sepSchoolHonorInfoList[index].awardPic.push(res.data)
          self.infoForm.sepSchoolHonorInfoList[index].awardPic = self.infoForm.sepSchoolHonorInfoList[index].awardPic.join()
          console.log(self.infoForm.sepSchoolHonorInfoList[index].awardPic)
        } else {
          self.infoForm.sepSchoolHonorInfoList[index].awardPic = res.data
        }
      })
    },
    // 场景上传图片
    scenePic (file, index) {
      let headFile = file.file
      let formData = new FormData()
      formData.append('file', headFile)
      let self = this

      upload(formData).then((res) => {
        this.$message.success('上传成功')
        if (this.infoForm.sepSchoolSceneInfoList[index].imageUrlList) {
          this.infoForm.sepSchoolSceneInfoList[index].imageUrlList.push(res.data)
        } else {
          this.infoForm.sepSchoolSceneInfoList[index].imageUrlList = [res.data]
        }
        if (self.infoForm.sepSchoolSceneInfoList[index].imageUrl) {
          self.infoForm.sepSchoolSceneInfoList[index].imageUrl = self.infoForm.sepSchoolSceneInfoList[index].imageUrl.split(',')
          self.infoForm.sepSchoolSceneInfoList[index].imageUrl.push(res.data)
          self.infoForm.sepSchoolSceneInfoList[index].imageUrl = self.infoForm.sepSchoolSceneInfoList[index].imageUrl.join()
          console.log(self.infoForm.sepSchoolSceneInfoList[index].imageUrl)
        } else {
          self.infoForm.sepSchoolSceneInfoList[index].imageUrl = res.data
        }
        console.log(this.infoForm.sepSchoolSceneInfoList[index].imageUrl)
      })
    },
    //
    historyPic (file, fileList) {
      let headFile = file.file
      let formData = new FormData()
      formData.append('file', headFile)
      upload(formData).then((res) => {
        this.$message.success('上传成功')
        if (!this.infoForm.historyList) {
          this.infoForm.historyList = []
        }
        this.infoForm.historyList.push(res.data)
        console.log(this.infoForm.historyList)
      })
    },
    conceptPic (file, fileList) {
      let headFile = file.file
      let formData = new FormData()
      formData.append('file', headFile)
      upload(formData).then((res) => {
        this.$message.success('上传成功')
        if (!this.infoForm.conceptPicList) {
          this.infoForm.conceptPicList = []
        }
        this.infoForm.conceptPicList.push(res.data)
      })
    },
    // 关闭当前弹框
    close () {
      this.$emit('closeAddSchoolForm', false)
      this.activeName = '1'
      this.infoForm = {
        sepSchoolHonorInfoList: [],
        sepSchoolSceneInfoList: []
      }
    },
    // 保存修改信息
    sub () {
      // // 获取登录用户信息
      // const user = JSON.parse(localStorage.getItem('Standard__User-Info'))
      // this.infoForm.userNo = user.value.userNo
      // this.infoForm.tenantNo = user.value.tenantNo
      // console.log(this.encrypt(this.infoForm.registerAccount))
      let historyPic = this.infoForm.historyList ? this.infoForm.historyList.join() : ''
      let conceptPic = this.infoForm.conceptPicList ? this.infoForm.conceptPicList.join() : ''
      let data = Object.assign({}, this.infoForm, { historyPic: historyPic,
        conceptPic: conceptPic })
      updateSepSchool({ encryptParam: encrypt(data) }).then(res => {
        if (res.code === 0) {
          this.$message.success('保存成功')
          getSepSchool({ no: this.infoForm.no, name: this.data.name }).then(res => {
            this.infoForm = JSON.parse(decrypt(res.data))
          })
          // this.close()
        }
      })
    },
    // 加密
    encrypt (plaintText) {
      var options = {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
      }
      var key = CryptoJS.enc.Utf8.parse(CRYPTOJSKEY)
      var encryptedData = CryptoJS.AES.encrypt(plaintText, key, options)
      var encryptedBase64Str = encryptedData.toString().replace(/\//g, '_')
      encryptedBase64Str = encryptedBase64Str.replace(/\+/g, '-')
      return encryptedBase64Str
    },
    see (file, fileList) {
      let headFile = file.file
      let formData = new FormData()
      formData.append('file', headFile)
      importSchoolHonor(formData).then((res) => {
        this.$message.success('导入成功')
        getSepSchool({ no: this.infoForm.no, name: this.data.name }).then(res => {
          this.infoForm = res.data
          console.log(this.infoForm)
        })
      })
    },
    // 删除当前添加的照片
    handleRemove () {},

    show (event) {
      console.log(event)
    },

    openImportHonor () {
      this.isImportHonor = true
    },

    closeImportHonor () {
      this.isImportHonor = false
    },

    handlefileSuccess (response) {
      if (response.code === 0) {
        this.$message.success('导入成功！')
        this.editDataInfo(this.editRowID)
        setTimeout(() => {
          this.isImportHonor = false
        }, 0)
      } else {
        this.$message.error(response.msg)
      }
    },

    beforeUpload (file) {
      // this.honorImportParam = { studentCode: this.infoForm.code };
      const extension = file.name.split('.')[1] === 'xls'
      const extension2 = file.name.split('.')[1] === 'xlsx'
      const zipType = file.name.split('.')[1] === 'zip'
      const isLt2M = file.size / 1024 / 1024 < 200
      if (!extension && !extension2 && !zipType) {
        this.$message.warning('导入模板只能是xls、xlsx、zip格式!')
        return false
      } else if (!isLt2M) {
        this.$message.warning('导入模板大小不能超过 200MB!')
        return false
      } else {
        return true
      }
    },

    validateFaxPhone (rule, value, callback) {
      let patter = /^((0\d{2,3}-\d{7,8})|(1[3576849]\d{9}))$/
      if (value && !patter.test(value.toString().trim()) && value.toString().trim() !== '') {
        callback(new Error('请输入正确的传真电话'))
      } else {
        callback()
      }
    },
    validateEmail (rule, value, callback) {
      // eslint-disable-next-line no-useless-escape
      let patter = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/
      if (value && !patter.test(value.toString().trim()) && value.toString().trim() !== '') {
        callback(new Error('请输入正确的邮箱地址'))
      } else {
        callback()
      }
    },
    validateWebsite (rule, value, callback) {
      // eslint-disable-next-line no-useless-escape
      let patter = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/|www\.)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/
      if (value && !patter.test(value.toString().trim()) && value.toString().trim() !== '') {
        callback(new Error('请输入正确的网址'))
      } else {
        callback()
      }
    },
    validateName (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请输入学校名称'))
        } else if (value.length > 30) {
          callback(new Error('学校名称不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请输入学校名称'))
      }
    },
    validateUnicode (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请输入学校编码'))
        } else if (value.length > 30) {
          callback(new Error('学校编码不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请输入学校编码'))
      }
    },
    validatePostCode (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请输入邮政编码'))
        } else if (value.length > 30) {
          callback(new Error('邮政编码不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请输入邮政编码'))
      }
    },
    validateAddress (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请输入学校地址'))
        } else if (value.length > 30) {
          callback(new Error('学校地址不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请输入学校地址'))
      }
    },
    validateAdministrativeCode (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择行政区'))
        } else if (value.length > 30) {
          callback(new Error('行政区不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择行政区'))
      }
    },
    validateAreaCode (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择所在城乡类型'))
        } else if (value.length > 30) {
          callback(new Error('城乡类型不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择所在城乡类型'))
      }
    },
    validateContact (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请输入联系人'))
        } else if (value.length > 30) {
          callback(new Error('联系人不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请输入联系人'))
      }
    },
    validateType (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择学校办学类型'))
        } else if (value.length > 30) {
          callback(new Error('学校办学类型不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择学校办学类型'))
      }
    },
    validateContactWay (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请输入联系方式'))
        } else if (value.length > 30) {
          callback(new Error('联系方式不能超过30个字符'))
        } else {
          let patter = /^((0\d{2,3}-\d{7,8})|(1[3576849]\d{9}))$/
          if (!patter.test(value.trim())) {
            callback(new Error('请输入正确的联系方式'))
          } else {
            callback()
          }
        }
      } else {
        callback(new Error('请输入联系方式'))
      }
    },
    validateSchTypeNo (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择学校办别类型'))
        } else if (value.length > 30) {
          callback(new Error('学校办别类型不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择学校办别类型'))
      }
    },
    validateSchoolYear (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择建校年月'))
        } else if (value.length > 30) {
          callback(new Error('建校年月不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择建校年月'))
      }
    },
    validateOrganizerCode (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择学校举办部门'))
        } else if (value.length > 30) {
          callback(new Error('学校举办部门不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择学校举办部门'))
      }
    },
    validateDecorationDay (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择校庆日'))
        } else if (value.length > 30) {
          callback(new Error('校庆日不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择校庆日'))
      }
    },
    validateEduDeptNo (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择学校属地主管部门'))
        } else if (value.length > 30) {
          callback(new Error('学校属地主管部门不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择学校属地主管部门'))
      }
    },
    validateEduMasterNo (rule, value, callback) {
      if (value) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择学校所属主管部门'))
        } else if (value.length > 30) {
          callback(new Error('学校所属主管部门不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择学校所属主管部门'))
      }
    },
    validateIsDistrict (rule, value, callback) {
      if (value || value === 0) {
        if (value.toString().trim() === '') {
          callback(new Error('请选择是否有分校区'))
        } else if (value.length > 30) {
          callback(new Error('是否有分校区不能超过30个字符'))
        } else {
          callback()
        }
      } else {
        callback(new Error('请选择是否有分校区'))
      }
    },
    init () {
      sepDataDicInfoQuery().then(res => {
        this.comData = res.data
      })
      // 荣誉级别
      getHonor().then(res => {
        this.honorLevels = res.data
      })
    },
    // 新增学校荣誉
    addSchoolHonor () {
      this.infoForm.sepSchoolHonorInfoList.unshift({ awardPic: '' })
    },
    getSchoolHonorTemp () {
      downloadTemplateHonor().then(res => {
        if (res.code === 0) {
        }
      })
    },
    addSchoolScene () {
      this.infoForm.sepSchoolSceneInfoList.unshift({ imageUrl: '' })
    },
    // 删除当前条学校荣誉
    delHonor (data) {
      this.$confirm('此操作将删除本校该条荣誉信息 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let params = {
          no: data
        }
        deleteHonor(params).then(res => {
          if (res.code === 0) {
            this.$message.success('删除成功')
            getSepSchool({ no: this.infoForm.no, name: this.data.name }).then(res => {
              this.infoForm = res.data
            })
          }
        })
      })
    },
    // 删除当前条学校特色场景
    delSence (data) {
      this.$confirm('此操作将删除本校该特色场景 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let params = {
          no: data
        }
        deleteScene(params).then(res => {
          if (res.code === 0) {
            this.$message.success('删除成功')
            getSepSchool({ no: this.infoForm.no, name: this.data.name }).then(res => {
              this.infoForm = res.data
              // getFileSource({ fileName: '2022-02-16/1645001499456887.jpg' }).then(res => {
              //   this.infoForm.historyList = [window.URL.createObjectURL(res.data)]
              //   setTimeout(function () {
              //     window.URL.revokeObjectURL(this.infoForm.historyList[0])
              //   }, 0)
              //   console.log(window.URL.createObjectURL(res.data))
              // })
            })
          }
        })
      })
    },
    // e
    synPersonnelDataMethod (data) {
      synPersonnelData({ no: this.infoForm.no, name: this.data.name }).then(res => {
        if (res.code === 0) {
          this.$message.success('同步成功')
          // this.close()
        }
      })
      getSepSchool({ no: this.infoForm.no, name: this.data.name }).then(res => {
        this.infoForm = res.data
        // getFileSource({ fileName: '2022-02-16/1645001499456887.jpg' }).then(res => {
        //   this.infoForm.historyList = [window.URL.createObjectURL(res.data)]
        //   setTimeout(function () {
        //     window.URL.revokeObjectURL(this.infoForm.historyList[0])
        //   }, 0)
        //   console.log(window.URL.createObjectURL(res.data))
        // })
      })
    },
    beforeAvatarUpload (file) {
      const isJPG =
        file.type === 'image/jpeg' ||
        file.type === 'image/bmp' ||
        file.type === 'image/png'
      const isLt2M = file.size / 1024 / 1024 < 10

      if (!isJPG) {
        this.$message.error('上传头像图片只能是 JPG、PNG、BMP 格式!')
      }
      if (!isLt2M) {
        this.$message.error('上传头像图片大小不能超过 10MB!')
      }
      return isJPG && isLt2M
    },
    historyPicChange () {
      console.log(this.list)
    }
  },
  mounted () {
    this.init()
    this.activeName = '1'
  }
}
</script>

<style lang="scss" scoped>
.switch-btn{
  width: 50px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 20px;
  position: absolute;
  right: 0;
  top: 5px;
}

.app-inner {
  /deep/ .foot {
    text-align: center;
    > * {
      margin:0 80px;
    }
  }
  /deep/ .el-tabs__content {
    height: 480px;
    overflow-x: scroll;
    overflow-y: auto;
  }
  /deep/ .el-form-item--small .el-form-item__content {
    width: 200px;
  }
  .el-dialog--center .el-dialog__body {
    height: 620px;
  }
  // 校史发展 教学理念 校园特色场景
  .school-history-development, .teaching-concept, .campus-characteristic-scene {
    .box {
      display: flex;
      margin: 20px;
      .title {
        flex: 0.1;
      }
      .content {
        flex: 1;
      }
      .editor-content {
        height:300px;
        border:1px solid #c9d8db;
        border-top: none;
        min-height:300px;
      }
      .title {
        float: left;
        width: 120px;
      }
      .content-input {
        float: left;
        width: 300px;
      }
      .avatar-box :first-child {
        margin-left: 0;
      }
      .avatar {
        float: left;
        margin-left: 10px;
      }
    }
    .box2 {
      // display: flex;
      margin: 20px;
      .title {
        float: left;
        width: 120px;
      }
      .content-input {
        float: left;
        width: 300px;
      }
      .avatar-box :first-child {
        margin-left: 0;
      }
      .avatar {
        float: left;
        margin-left: 10px;
      }
    }
  }
  // 学校荣誉
  .school-honors {
    .box {
      margin: 20px;
      .title {
        float: left;
        width: 120px;
      }
      .content-input {
        float: left;
        width: 300px;
      }
      .avatar-box :first-child {
        margin-left: 0;
      }
      .avatar {
        float: left;
        margin-left: 10px;
      }
    }
  }
  .reData{
    position: absolute;
    right: 0;
    top: 0;
  }
  .person{
    display: inline-block;
  }
}
.info-school-tab{
  min-width: 700px;
}
.line{
  display: inline-block;
  width: 50%;
}
// /deep/.el-dialog__wrapper{
//   z-index: 54!important;
// }
// /deep/ .el-dialog{
//   z-index: 84!important;
// }
.fimg{
  width:100%;
  height: 100%;
}
.import-honor-des {
  .title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 30px;
  }
  .box1 {
    margin-bottom: 20px;
    .btn {
      margin-left: 20px;
      padding: 0;
    }
  }
  .text {
    margin-bottom: 20px;
  }
}
.hver{
  position: absolute;
  top:0;
  left: 0;
  visibility: hidden;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0,0.3);
}
.sr:hover .hver{
  visibility: visible;
}
</style>
